.book-carousel:before, .book-carousel:after, .book-carousel:before, .book-carousel:after, .tab-pane:before, .tab-pane:after, .figures-of-month:before, .figures-of-month:after, .research-areas ul:before, .research-areas ul:after {content:""; display:table}
.book-carousel:after,  .book-carousel:after, .tab-pane:after, .figures-of-month:after, .research-areas ul:after {clear:both}
.book-carousel, .book-carousel, .tab-pane, .figures-of-month, .research-areas ul  {zoom:1}

.research-areas ul li a, .book-carousel > div, .home-gallery a:hover img  {-webkit-transition: all .3s ease-in; -moz-transition: all .3s ease-in; -ms-transition: all .3s ease-in; -o-transition: all .3s ease-in; transition: all .3s ease-in}
.research-areas ul, .figures-of-month ul {list-style:none; list-style-image:none;list-style-type: none; margin: 0; padding: 0}
.research-areasul li a:hover, .research-areas ul li a:focus {text-decoration: none}

.subejcts-container {width: 100%;padding-top: 20px;padding-bottom: 20px;background-color: #f0f0f0;position: relative;z-index: 1; margin-bottom: 0}
.research-areas {float: left;width: 25%; padding-right: 10px}
.research-areas h2 {color: #fff;background-color: #666666;font-size: 16px;margin: 0;padding: 10px 36px;font-size: 14px; text-transform: uppercase}
.research-areas ul {background-color: #ed8a65;padding: 5px 15px}
.research-areas ul li {display: block}
.research-areas ul li a {display: block;color: #fff;padding: 4px 17px;font-size: 14px; border-top: 1px solid #666666}
.research-areas ul li:first-child a {border-top: none}
.research-areas ul li a:hover {background-color: #f3794e;text-decoration: none}

.subejcts-container .carousel-caption h2 {color: #f3794e;text-transform: uppercase;font-weight: 600;}
.subejcts-container .carousel-caption p {color: #000;font-weight: 500}
.subejcts-container .carousel-caption {right: 60px;bottom: 60px;left: auto;text-align: left;padding-bottom: 0; padding-left: 20px}
.subejcts-container .carousel {overflow: hidden}
.img-short-desc {opacity: 0; background-color: rgba(255, 255, 255, 0.8); text-align: center;padding: 5px;position: absolute;bottom: 0; width: 100% }
.img-short-desc h4 {font-size: 13px;margin: 0;margin-bottom: 3px; font-weight: bold}
.img-short-desc p {font-size: 10px; margin-bottom: 0}
.lastest-additions .tab-content {padding-bottom: 0; min-height: 160px}
.lastest-additions {float: left; width: 55%;padding-left: 10px; padding-right: 10px;}
.home-gallery {float: left;width: 25%;padding-right: 10px;min-height: 200px;}
.home-gallery a { display: block;overflow: hidden;  height: 257px; position: relative}
.home-gallery a img {display: block;margin: auto;max-height: 100%;max-width: 100%;position: absolute;top: 0;left: 0;right: 0;bottom: 0;}
.home-gallery a img.wide {max-height: initial;max-width: initial;height: 100%}
.home-gallery a img.tall {max-height: initial;max-width: initial;width: 100%}
.figures-of-month {float: left;width: 20%;  padding-left: 10px;}
.figures-of-month h3, .lastest-additions h3, .home-gallery h3 {font-size: 14px;text-transform: uppercase;color: #374251;margin-bottom: 17px;  margin-top: 28px}
.figures-of-month h4 {color: #fff;padding: 7px 15px;background-color: #bdc3c7;font-size: 14px; margin: 0}
.figures-of-month h4.ebook-figures {background-color: #99cccc}
.figures-of-month ul {color: #666666;padding: 5px 15px 7px 15px;background-color: #dddddd;font-size: 12px;margin-bottom: 3px;}
.figures-of-month ul li span { color: #f3794e; font-weight: 600}
#slide {width: 1025px;height: 478px; position: relative}
.slide {position: relative}
.text-slider { text-transform: uppercase;color: #b21a03;font-size: 22px;font-weight: bold;white-space: nowrap; font-family: Arial, Helvetica,sans-serif;line-height: 1.1em;position: absolute;top: 30px; left: 415px;}
.text-slider span { display: block;padding: 0}
.text-slider span:nth-child(1) {padding-left: 35px}
.text-slider span:nth-child(2) {padding-left: 25px}
.text-slider span:nth-child(3) {padding-left: 18px}
.text-slider span:nth-child(4) {padding-left: 14px}
.text-slider span:nth-child(5) {padding-left: 8px}
.slide h2 {color: #fff; font-weight: 600;font-size: 36px;position: absolute;white-space: nowrap; margin: 0}
.slide.slide-1 h2 {top: 342px; left: 430px;}
.slide.slide-3 h2 {top: 150px;left: 90px;color: #333; font-size: 20px}
.slide.slide-4 h2 {top: 410px;right: 40px;text-align: right; font-size: 22px;}
.slide p {color: #fff;font-weight: 500;font-size: 18px;position: absolute;white-space: nowrap; margin: 0}
.slide.slide-1 p {top: 382px; left: 430px}
.slide.slide-3 p {top: 155px;left: 130px;color: #000}
.slide.slide-4 p {top: 425px;right: 90px;text-align: right}
.slide .logo-slider {position: absolute;width: 182px}
.slide.slide-1 .logo-slider {top: 45px; left: 90px}
.slide.slide-3 .logo-slider {top: 50px; left: 750px}
.slide.slide-4 .logo-slider {top: 35px; left: 210px}
.delay0 {animation-delay:.5s;-webkit-animation-delay:.5s}
.delay1 {animation-delay:1s;-webkit-animation-delay:1s}
.delay2 {animation-delay:1.5s;-webkit-animation-delay:1.5s}
.delay3 {animation-delay:2s;-webkit-animation-delay:2s}
.delay4 {animation-delay:2.5s;-webkit-animation-delay:2.5s}


@media (max-width: 767px) {
    .subejcts-container .container .row .pull-right, .subejcts-container .container .row .pull-left  { float: none !important}
    .subejcts-container .carousel {margin-bottom: 20px}
    .subejcts-container .carousel-caption h2 {font-size: 22px}
    .subejcts-container .carousel-caption p {font-size: 14px}
    .subejcts-container .carousel-caption {right: 10px;bottom: 10px}
    .research-areas ul {padding: 5px 10px}
    .research-areas ul li a {padding: 2px 0}
    .research-areas h2 {padding-left: 10px}
    .research-areas, .slider {width: 100%;float: none; padding: 0}
    .lastest-additions, .figures-of-month, .home-gallery {width: 100%;float: none;padding: 0;margin-bottom: 20px}
    .home-gallery a {height: auto}
    .home-gallery a img { height: auto !important;width: 100% !important;max-height: initial;max-width: initial;position: static}
    .figures-of-month ul { min-height: initial;margin-bottom: 18px; font-size: 14px;}
    .figures-of-month h4 {font-size: 16px;}
    #slide .slide h2 {padding: 0 5px; font-size: 17px !important;top: 205px !important;left: 0 !important; width: 100% !important;text-align: center !important; white-space: normal !important;color: #fff; text-shadow: 0 0 3px rgba(0,0,0,.9)}
    #slide .slide p { font-size: 13px !important;top: 230px !important;left: 0 !important; width: 100% !important;text-align: center !important;  white-space: normal !important;color: #fff; text-shadow: 0 0 3px rgba(0,0,0,.9)}
    #slide .slide img[src*="logo-ceeol"] {top: 20px !important;left: 190px !important;height: auto !important; width: 70px !important}
    .fullwidth .item .detail-container h4 {font-size: 16px}
    #slide {width: 100%;height: 260px;float: none}
    .text-slider {display: none}
    .fullwidth .item {height: 250px}
}
@media (min-width: 768px) and (max-width: 991px) {
    .main-search-input {width: 340px; margin-left: 0}
    .subejcts-container .carousel-caption h2 {font-size: 22px}
    .subejcts-container .carousel-caption p {font-size: 14px}
    .subejcts-container .carousel-caption {right: 10px;bottom: 10px}
    .subejcts ul li a {padding: 2px 10px;font-size: 12px}
    .carousel-inner > .item > img, .carousel-inner > .item > a > img {width: auto;height: 100%; max-width: inherit}
    .research-areas ul {padding: 10px 15px}
    .research-areas ul li a {padding: 2px 0 2px 10px;font-size: 12px}
    .research-areas ul li { float: left;width: 50%; padding-right: 20px}
    .research-areas ul li:nth-child(2) a {border-top: 1px solid transparent;}
    .research-areas h2 {padding: 10px 26px}
    .research-areas { width: 100%;float: none; padding: 0}
    .slider { width: 100%;float: none; padding: 0}
    .lastest-additions {width: 66.66666666666666%}
    .figures-of-month { width: 100%; padding: 0}
    .lastest-additions .nav>li>a {padding: 7px 5px}
    .home-gallery {width: 33.33333333333333%}
    .home-gallery a {height: 255px}
    .figures-of-month div { float: left;margin-left: 20px;width: 48.2%}
    .figures-of-month div:first-of-type {margin-left: 0}
    .figures-of-month ul { min-height: 70px;margin-bottom: 18px; font-size: 14px;}
    .figures-of-month h4 {font-size: 16px;}
    .lastest-additions .tab-content>.tab-pane {padding: 13px 15px;min-height: 218px}
    #slide {width: 100%;height: 400px;float: none}
    .text-slider {top: 33px;left: 350px; font-size: 17px}
    .slide h2 {font-size: 32px}
    .slide.slide-1 h2 {top: 315px; left: 270px}
    .slide.slide-3 h2 { top: 102px;left: 210px;white-space: normal;text-align: right;width: 370px}
    .slide.slide-4 h2 {top: 350px;right: 45px;font-size: 18px}
    .slide p {font-size: 16px}
    .slide.slide-1 p {top: 350px; left: 270px}
    .slide.slide-3 p {top: 125px;left: 90px}
    .slide.slide-4 p {top: 368px;right: 90px}
    .slide .logo-slider {width: 160px}
    .slide.slide-1 .logo-slider {top: 43px; left: 83px}
    .slide.slide-3 .logo-slider {top: 40px; left: 600px}
    .slide.slide-4 .logo-slider {top: 30px; left: 180px}
    .fullwidth .item {height: 190px}
}
@media (min-width: 992px) and (max-width: 1199px) {
    .subejcts-container .carousel-caption {right: 10px;bottom: 10px}
    .carousel-inner > .item > img, .carousel-inner > .item > a > img {width: auto;height: 100%; max-width: inherit}
    .research-areas ul li a {padding: 1px 0 2px 10px;font-size: 11px;height: 19px;}
    .research-areas ul {padding: 5px 15px 5px 15px}
    .research-areas h2 {padding: 7px 26px 7px 26px}
    .carousel-caption {width: 400px}
    .subejcts-container .carousel-caption h2 {font-size: 22px}
    .subejcts-container .carousel-caption p {font-size: 14px}
    .lastest-additions .nav>li>a{padding: 9px 12px;font-size: 11px;}
    .home-gallery a {height: 204px}
    .figures-of-month ul { font-size: 11px; padding: 3px 2px 4px 8px;}
    .figures-of-month h4 {font-size: 12px;padding: 5px 8px;}
    .lastest-additions .tab-content>.tab-pane {padding: 8px 15px;min-height: 163px}
    #slide {width: 695px;height: 324px;}
    .slide h2 {font-size: 24px}
    .slide.slide-1 h2 {top: 240px; left: 275px}
    .slide.slide-3 h2 {top: 65px;left: 100px; white-space: normal; text-align: right; width: 370px;}
    .slide.slide-4 h2 {top: 280px;right: 44px;font-size: 15px}
    .slide p {font-size: 13px}
    .slide.slide-1 p {top: 265px; left: 275px}
    .slide.slide-3 p {top: 93px;left: 70px}
    .slide.slide-4 p {top: 290px;right: 90px}
    .slide .logo-slider {width: 120px}
    .slide.slide-1 .logo-slider {top: 40px; left: 77px}
    .slide.slide-3 .logo-slider {top: 30px; left: 490px}
    .slide.slide-4 .logo-slider {top: 20px; left: 144px}
    .text-slider {top: 20px;left: 280px; font-size: 14px}
    .lastest-additions {width: 52%;}
    .figures-of-month {width: 23%;}
    .fullwidth .item {height: 147px;}
    .fullwidth .item .detail-container h4 {font-size: 9px}
}
@media (min-width: 1200px) and (max-width: 1499px) {
    .subejcts-container .carousel-caption {right: 10px;bottom: 10px}
    .carousel-inner > .item > img, .carousel-inner > .item > a > img {width: auto;height: 100%; max-width: inherit}
    .research-areas ul li a {padding: 1px 0 2px 10px;font-size: 11px;height: 19px;}
    .research-areas ul {padding: 5px 15px 5px 15px}
    .research-areas h2 {padding: 7px 26px 7px 26px}
    .carousel-caption {width: 400px}
    .subejcts-container .carousel-caption h2 {font-size: 28px}
    .subejcts-container .carousel-caption p {font-size: 16px}
    .lastest-additions .nav>li>a{padding: 9px 12px;font-size: 11px;}
    .home-gallery a {height: 204px}
    .figures-of-month ul { font-size: 11px; padding: 3px 2px 4px 8px;}
    .figures-of-month h4 {font-size: 12px;padding: 5px 8px;}
    .lastest-additions .tab-content>.tab-pane {padding: 8px 15px;min-height: 163px}
    #slide {width: 695px;height: 324px;}
    .slide h2 {font-size: 24px}
    .slide.slide-1 h2 {top: 240px; left: 275px}
    .slide.slide-3 h2 {top: 65px;left: 100px; white-space: normal; text-align: right; width:370px;}
    .slide.slide-4 h2 {top: 280px;right: 33px; font-size: 15px}
    .slide p {font-size: 13px}
    .slide.slide-1 p {top: 265px; left: 275px}
    .slide.slide-3 p {top: 93px;left: 70px}
    .slide.slide-4 p {top: 290px;right: 90px}
    .slide .logo-slider {width: 120px}
    .slide.slide-1 .logo-slider {top: 40px; left: 77px}
    .slide.slide-3 .logo-slider {top: 30px; left: 490px}
    .slide.slide-4 .logo-slider {top: 20px; left: 144px}
    .text-slider {top: 20px;left: 280px; font-size: 14px}
    .lastest-additions {width: 52%;}
    .figures-of-month {width: 23%;}
    .fullwidth .item {height: 147px;}
    .fullwidth .item .detail-container h4 {font-size: 9px}
}
@media (min-width: 1500px) and (max-width: 1920px) {
    .carousel-caption {width: 550px}
    .lastest-additions .tab-content>.tab-pane {padding: 13px 15px;min-height: 218px}
    .fullwidth .item {height: 190px}
}